<template>
    <view class="qrcode tn-safe-area-inset-bottom">
        <tn-navbar z-index="1" index-url="/pages/index" fixed :bottom-shadow="false">邀请码</tn-navbar>
        <view class="qrcode-img">
            <img :src="qrcodeUrl" />
            <view class="qrcode-desc">长按图片保存</view>
        </view>

    </view>
</template>
  
<script setup lang="ts">
import { onMounted, ref, reactive } from "vue";
import TnNavbar from "@/tuniao-ui/components/tn-navbar/src/Navbar.vue";
import { useUserStore } from "@/tuniao-ui/store/user";
import { navLogin } from "@/tuniao-ui/utils";
import { domain } from "@/config";
const userStore = useUserStore();
const isLogin = ref<boolean>(false);
const qrcodeUrl = ref("");

onMounted(() => {
    isLogin.value = userStore.isLogin();
    if (isLogin.value) {
        let memberNo = userStore.getMemberNo
        let url = `${domain.h5}?memberNo=${memberNo}`;
        //
        //qrcodeUrl.value = "https://api.qrserver.com/v1/create-qr-code/?size=200x200&margin=10&data=" + url;
        qrcodeUrl.value = "https://qun.qq.com/qrcode/index?size=500&data=" + url;
        
    } else {
        navLogin();
    }

});
</script>
  
<style lang="scss" scoped>
.qrcode {
    background-color: #fff;
    
    &-img {
        margin-top: 50rpx;
        text-align: center;
        img {
            width: 100%;
        }
    }

    &-desc {
        font-size: 35rpx;
        margin-top: 20rpx;
        color: #080808;
    }
}
</style>
  